<template>
  <div>
    <van-form>
      <p class="title">宠物信息</p>
      <van-field
        name="用户名"
        class="firstcell"
        input-align="right"
        label="昵称："
        placeholder="请输入宠物昵称"
        error-message-align="right"
        :rules="[{ required: true, message: '请输入宠物昵称' }]"
        :border="false"
      />
      <van-field
        name="年龄"
        readonly
        input-align="right"
        label="年龄："
        placeholder="点击选择年龄"
        error-message-align="right"
        :border="false"
        clickable
        :value="value"
        @click="showPicker = true"
      />
      <van-popup v-model="showPicker" round position="bottom">
        <van-picker
          show-toolbar
          :columns="columns"
          @cancel="showPicker = false"
          @confirm="onConfirm"
        />
      </van-popup>

      <van-field
        name="地区"
        readonly
        input-align="right"
        label="地区："
        placeholder="点击选择地区"
        error-message-align="right"
        :border="false"
        clickable
      />
    </van-form>
  </div>
</template>

<script>
export default {};
</script>

<style lang="scss" scoped>
</style>